<%@ page import="org.gnomus.server.Context" %>
<%@ page import="org.gnomus.util.io" %>
<%@ page import="java.io.File" %>
<%@ page import="java.util.Map" %>
<%@ page import="java.util.List" %>
<%@ page import="com.google.gson.Gson" %>
<%@ page import="org.gnomus.server.C" %>
<%
  Context ctx = Context.get();
  Map lesson = (Map) ctx.data.get("lesson");
  if ("create".equals(ctx.action)) {
%>
<div id="item_create">
  <p class="xlarge b">
    <a href="/lesson/edit?id=<%= lesson.get("id") %>">
      <%= lesson.get("title") %>
    </a>
  </p>
  <p class="large">
    Create an item
  </p>
  <hr />
  <form method="post" action="/item/create" onsubmit="return validate($(this));">
    <label for="item_name">
      Item Name:
    </label>
    <input name="item_name" type="text" validation="required" style="width:400px;"/>
    <input name="lesson_id" type="hidden" value="<%= lesson.get("id") %>" />
    <input name="b" type="hidden" value="<%= ctx.b %>" />
    <input type="submit" value="Create" />
  </form>
</div>
<%
  } else if ("edit".equals(ctx.action)) {
    Map item = (Map) ctx.data.get("item");
    String id = (String) item.get("id");
    String reading = (String) item.get("reading");
    if (reading == null || reading.length() == 0) {
      reading = "Write some instructions for completing your activity here.";
    }
    List<Map> activity_list = item == null ? null : (List<Map>) item.get("activity");
    Map activity = null;
    if (activity_list != null && activity_list.size() > 0) {
      activity = activity_list.get(0);
    }
%>
<div id="item_edit">
  <script>
    $(document).ready(function() {
      item.init(<%= new Gson().toJson(item) %>);
    })
  </script>
  <p class="xlarge b">
    <a href="/lesson/edit?id=<%= lesson.get("id") %>">
      <%= lesson.get("title") %>
    </a>
  </p>
  <p class="large">
    Assignment :
    <span class="assignment-name" onclick="editAssignmentName();"><%= item.get("title") %></span>
    <textarea id="item_name" class="on-enter-key-blur d-none"
              onblur="item.editName('<%= id %>')"
              ><%= item.get("title") %></textarea>
    <a class="normal edit-assignment-name" style="padding-left:4px;"
       onclick="editAssignmentName();">edit name</a>
    <script type="text/javascript">
      function editAssignmentName() {
        $("span.assignment-name,a.edit-assignment-name").hide();
        $("textarea#item_name").show();
        $("textarea#item_name").focus();
      }
    </script>
  </p>
  <hr />
  <div>
    <p class="large">
      Reading
      <a class="normal edit-assignment-reading" style="padding-left:4px;"
         onclick="editAssignmentReading();">edit</a>
    </p>
    <span class="assignment-reading" onclick="editAssignmentReading();"><%= reading %></span>
    <textarea id="reading" class="d-none"
              onblur="item.editReading('<%= id %>')"><%= reading %></textarea>
    <script type="text/javascript">
      var tar;
      var sar;

      $(document).ready(function() {
        tar = $("textarea#reading");
        sar = $("span.assignment-reading");
        if (tar[0].value.length == 0) {
          tar[0].value = "Write something about the assignment here.";
        }
      });
      function editAssignmentReading() {
        tar.height($(sar[0]).height());
        sar.hide();
        $("a.edit-assignment-reading").hide();
        tar.show();
        tar.focus();
      }
    </script>
  </div>
  <div>
    <%
      if (activity == null) {
    %>
    <p class="large">
      Activity
      <a class="normal" style="padding-left:4px;"
         onclick="$(this).hide();$('#no_activity_found').hide();$('#create_activity').show();">
        create
      </a>
    </p>
    <form id="create_activity" action="/activity/create" method="post" class="d-none">
      <label for="type" style="font-size:20px;">
        Type:
      </label>
      <select id="type" name="type">
        <%
          for (Map.Entry<String, String> me : C.ACTIVITY_TYPES.entrySet()) {
        %>
        <option value="<%= me.getKey() %>"><%= me.getValue()%></option>
        <%
          }
        %>
      </select>
      <input type="hidden" name="assignment_id" value="<%= item.get("id") %>"/>
      <input type="submit" value="Create activity" />
    </form>
    <p id="no_activity_found">
      No activity found for this item.
    </p>
    <%
      } else if ("drag_and_drop".equals(activity.get("type"))) {
    %>
    <jsp:include page="/WEB-INF/activity/play/drag_and_drop.jsp"></jsp:include>
    <%
      } else if ("construct".equals(activity.get("type"))) {
    %>
    <jsp:include page="/WEB-INF/activity/play/construct.jsp"></jsp:include>
    <%
      } else {
    %>
    <p>
      Error loading activity of type = <%= activity.get("type") %>
    </p>
    <%
      }
    %>
  </div>
</div>
<%
  } else {
%>
<div id="assignment_not_found">
  Invalid action<%= ctx.action != null ? "(" + ctx.action + ")" : "" %> for item.
</div>
<%
  }
%>